<style scoped>
.line {
}

.line div {
  height: 0px;
  border-bottom: 1px dotted #ddd;
  /*margin-top: 15px;*/
  margin-bottom: 24px;
  margin-right: 15px;
}

.pro-detail-content {
  padding-left: 20px;
}

.pr20 {
  padding-right: 20px;
}

h3 {
  /* margin-bottom: 20px; */
}

.btn {
  height: 30px;
  line-height: 28px;
  border: 1px solid #eee;
  width: 30px;
  text-align: center;
  color: #fff;
  border-radius: 4px;
  float: right;
}

.close {
  background-color: #f39b12;
}

.add {
  background-color: #428ccb;
  margin-right: 10px;
}

.form .ivu-row {
  padding: 20px 0;
  border-bottom: 1px solid #eee;
}

.common-box-body .ivu-input-group {
  top: 0;
}

.common-box-body {
  padding-left: 15px;
}

.common-box-header {
  margin-right: 15px;
}

.boderBottom {
  border-bottom: 1px solid #e2e2e2;
}
@media screen and (max-width: 1200px) {
  .pr0 {
    padding-right: 0 !important;
  }
}
</style>
<style>
.common-box-body .ivu-form-item label {
  height: 36px !important;
}
.form .ivu-input-group > .ivu-input:last-child, .ivu-input-group-append{
    background-color: #bebebe !important;
}
.form .ivu-input-group > .ivu-input:last-child,
.ivu-input-group-append {
  border-radius: 0 2px 2px 0 !important;
  background-color: #fff;
}
.inputNumber100 .ivu-input-number{
    width:100%;
}
</style>
<template>
    <div class="pro_scaling">
        <product-title></product-title>
        <div class="common-box-body">
            <!-- ref="proform" :rules="ruleValidate"          -->
            <Form :model="proform" ref="proform"  label-position="right" class="inputNumber100">
                <Row>
                    <Col :md="24" :lg="12">
                    <FormItem label="产品名称">
                        <Input disabled v-model="name" placeholder="请输入产品名称"></Input>
                    </FormItem>
                    </Col>
                </Row>
                <div class="common-box-header mb24">
                    <h3 class="">标保系数</h3>
                </div>
                <Row v-for="(items, index) in proform.standard"  class="">
                    <Col :md="24" :lg="6">
                    <FormItem :label="'交费期间'">
                        <i-input disabled v-model="items.pay_period" placeholder="请选择交费期间" ></i-input>
                    </FormItem>
                    </Col>
                    <Col :md="24" :lg="6">
                    <FormItem :label="'折标系数'">
                        <Input v-model="items.val" :disabled='disable' placeholder="请输入折标系数">
                        <span slot="append">%</span>
                        </Input>
                        <!-- <InputNumber :max="100" :min="0" v-model="items.val" :disabled='disable' placeholder="请输入综合标保系数" :formatter="value => `${value}%`" :parser="value => value.replace('%', '')"></InputNumber> -->
                        
                    </FormItem>
                    </Col>
                </Row>
                <div class="common-box-header mb24">
                    <h3 class="">价值系数</h3>
                </div>
                <Row v-for="(items, index) in proform.worth"  class="">
                    <Col :md="24" :lg="6">
                    <FormItem :label="'交费期间'">
                        <i-input disabled v-model="items.pay_period" placeholder="请选择交费期间" ></i-input>
                    </FormItem>
                    </Col>
                    <Col :md="24" :lg="6">
                    <FormItem :label="'价值系数'">
                        <Input v-model="items.val" :disabled='disable' placeholder="请输入价值系数">
                        <span slot="append">%</span>
                        </Input>
                        <!-- <InputNumber :max="100" :min="0" v-model="items.val" :disabled='disable'  placeholder="请输入综合标保系数" :formatter="value => `${value}%`" :parser="value => value.replace('%', '')"></InputNumber> -->
                    </FormItem>
                    </Col>
                </Row>
                <div class="common-box-header mb24">
                    <h3 class="">综合标保系数</h3>
                </div>
                <Row v-for="(items, index) in proform.year_standard"  class="">
                    <Col :md="24" :lg="6">
                    <FormItem :label="'交费期间'">
                        <i-input disabled v-model="items.pay_period" placeholder="请选择交费期间" ></i-input>
                    </FormItem>
                    </Col>
                    <Col :md="24" :lg="6">
                    <FormItem :label="'综合标保系数'">
                        <Input v-model="items.val" :disabled='disable' placeholder="请输入综合标保系数">
                        <!-- <InputNumber :max="100" :min="0" v-model="items.val" :disabled='disable' placeholder="请输入综合标保系数" :formatter="value => `${value}%`" :parser="value => value.replace('%', '')"></InputNumber> -->
                        <span slot="append">%</span>
                        </Input>
                    </FormItem>
                    </Col>
                </Row>
            </Form>
            <div id="footer" class="pt22">
                <Button type="primary" :disabled='sook' shape="circle" id="submit" @click="sendAll()" style="border-radius: 30px !important;">
                    <Icon type="checkmark-circled"></Icon>
                    保存 / 提交
                </Button>
                <Button id="back" shape="circle" @click="cancel" style="border-radius: 30px !important;background:#c3c4c4;margin-left:20px;color:white">返回</Button>
            </div>
        </div>
        
    </div>
</template>
<script>
import productTitle from "../../components/productTitle";
import {get_data,create,update,} from '../../api/pro.js'
export default {
  data() {
    return {
        sook:false,
        disable:false,
        mid: "",
        id:"",
        name:"",
      proform: {
        standard: [
          {
            pay_period: "",
            val: 0,
          }
        ],
        worth: [
          {
            pay_period: "",
            val: 0
          }
        ],
        year_standard: [
          {
            pay_period: "",
            val: 0
          }
        ],
      },
      
      submit:{
          standard:[],
          worth:[]
      }
    };
  },
  components: {
    productTitle
  },
  mounted() {},
  created() {
    this.getde()
    this.getList()
  },
  watch: {},
  mounted() {},
  methods: {
      getde(){
          this.mid = this.$route.params.id;
          this.name = this.$route.params.name;
      }, 
    getList() {
        var _parmas = {
            ptid:this.mid
        }
        new Promise((resolve, reject) => {
            get_data(_parmas).then(response => {
                if (response.data.err == 0) {
                    this.id = response.data.data.id
                    this.proform.standard = response.data.data.standard
                    this.proform.worth = response.data.data.worth
                    this.proform.year_standard = response.data.data.year_standard
                } else {
                    this.$Message.error(response.data.info);
                }
                resolve();
            }).catch(error => {
                reject(error);
            });
        });
    },
    sendAll() {
        this.sook = true;
        setTimeout(() => {
            this.sook = false;
         }, 2000);
        this.proform.ptid = this.mid;
        this.proform.mid = this.id;
        for(var i in this.proform.standard){
            if(isNaN(this.proform.standard[i].val)){
                 this.$Message.error("折标系数必须为数字")
                 return   
            }else{
                
            }
            if(this.proform.standard[i].val==''){
                this.proform.standard[i].val=0
            }
        }
        for(var i in this.proform.worth){
            if(isNaN(this.proform.worth[i].val)){
                 this.$Message.error("价值系数必须为数字")
                 return   
            }else{
                
            }
            if(this.proform.worth[i].val==''){
                this.proform.worth[i].val=0
            }
        }
        new Promise((resolve, reject) => {
            create(this.proform).then(response => {
                if (response.data.err == 0) {
                    if(this.$route.params.if==1){
                        this.$router.push({name:'pro'});
                    }
                    if(this.$route.params.if==2){
                        this.$router.push({name:'pro_scalinglist'});
                    }
                } else {
                    this.$Message.error(response.data.info);
                }
                resolve();
            }).catch(error => {
                reject(error);
            });
        });
    },
    cancel() {
        if(this.$route.params.if==1){
            this.$router.push({name:'pro'});
        }
        if(this.$route.params.if==2){
            this.$router.push({name:'pro_scalinglist'});
        }
    }
  }
};
</script>